<template>
	<view class="u-p-20">
		<view class="u-border u-p-20" @click="getDetail">
			<w-home-item title="所属小区" :value="item.areaName"></w-home-item>
			<u-gap height="5" bg-color="#ffffff"></u-gap>
			<w-home-item title="楼栋" :value="item.buildingName"></w-home-item>
			<u-gap height="5" bg-color="#ffffff"></u-gap>
			<w-home-item title="地址" :value="`${item.unitName}${item.houseName}室`"></w-home-item>
			<u-gap height="5" bg-color="#ffffff"></u-gap>
			<w-home-item title="电话" :value="item.mobile"></w-home-item>
		</view>
		<u-popup v-model="show" mode="center" closeable border-radius='8' width='75%'>
				<view class="u-p-40">
					<view class="">
						用户姓名：{{item.name}}
					</view>
					<view class="u-m-t-5">
						户主姓名：{{item.master}}
					</view>
					<view class="u-m-t-5">
						业主身份：{{item.userTypeName?item.userTypeName:'未设置'}}
					</view>
					<view class="u-m-t-5">
						电话：{{item.mobile}}
					</view>
					<view class="u-m-t-5">
						区域：{{item.areaName}}
					</view>
					<view class="u-m-t-5">
						房屋地址：{{`${item.buildingName}${item.unitName}${item.houseName}`}}室
					</view>
				</view>
			</u-popup>
	</view>
</template>

<script>
	export default {
		name:"w-home-list",
		props: {
			item: {
				type: Object,
				default: ()=>{
					return {}
				}
			},
		},
		data() {
			return {
				show:false
			};
		},
		methods: {
			getDetail() {
				this.show = true
			}
		},
	}
</script>

<style>
.u-border:after {
	border-radius: 30rpx;
}
</style>
